import 'dart:ffi';

import 'package:banyou_app/app/config/colors.dart';
import 'package:banyou_app/app/routes/app_pages.dart';
import 'package:banyou_app/app/util/common_utils.dart';
import 'package:banyou_app/app/widget/load_network_image_widget.dart';
import 'package:cached_network_image/cached_network_image.dart';
import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:flutter_swiper_null_safety/flutter_swiper_null_safety.dart';

import 'package:get/get.dart';

import '../controllers/xiangqu_controller.dart';

class XiangquView extends GetView<XiangquController> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
        body: Stack(children: [
      Positioned.fill(
          child: Image.asset(
        'assets/images/背景@2x.png',
        width: 1.sw,
        height: 1.sh,
        fit: BoxFit.cover,
      )),
      Positioned.fill(
        child: SafeArea(
          child: SingleChildScrollView(
            child: Container(
              padding: EdgeInsets.symmetric(horizontal: 16),
              child: Column(
                mainAxisAlignment: MainAxisAlignment.start,
                crossAxisAlignment: CrossAxisAlignment.start,
                children: [
                  const SizedBox(height: 20),
                  swiperWidget(),
                  SizedBox(height: 10),
                  tuijianWidget(),
                  SizedBox(height: 15),
                  Text(
                    '玩转本地',
                    style: TextStyle(
                        color: ColorConfig.text_label,
                        fontSize: 16.sp,
                        fontWeight: FontWeight.w600),
                  ),
                  SizedBox(height: 15),
                  Obx(() => Container(
                        color: ColorConfig.white,
                        child: ListView.separated(
                            padding: EdgeInsets.zero,
                            shrinkWrap: true,
                            physics: NeverScrollableScrollPhysics(),
                            itemBuilder: (c, i) {
                              return itemWidget(
                                  controller.attractionsList[i], i);
                            },
                            separatorBuilder: (c, i) {
                              return Container(
                                height: 10,
                              );
                            },
                            itemCount: controller.attractionsList.length),
                      ))
                ],
              ),
            ),
          ),
        ),
      )
    ]));
  }

  Widget itemWidget(Map item, int index) {
    List projects = (item['Projects'] ?? []);
    String projectsStr = projects.join('、');
    return InkWell(
      onTap: () {
        String full = box.read("full") ?? "";
        if (full.isNotEmpty) {
          showMang(full);
        } else {
          Get.toNamed(Routes.JINGDIANXIANGQING, arguments: item);
        }
      },
      child: Container(
        child: Row(
          children: [
            Container(
              width: 138.w,
              height: 148.w,
              clipBehavior: Clip.hardEdge,
              decoration: BoxDecoration(
                borderRadius: BorderRadius.all(Radius.circular(10.r)),
              ),
              child: Stack(
                children: [
                  Positioned.fill(
                    child: LoadNetworkImageWidget(
                        fit: BoxFit.cover,
                        height: double.infinity,
                        imageUrl: item['PictureUrl'] ?? ""),
                  ),
                  Positioned(
                    top: 0,
                    left: 0,
                    width: 42,
                    height: 18,
                    child: Stack(
                      children: [
                        Positioned.fill(
                            child: Image.asset('assets/images/路径 20@2x.png')),
                        Positioned.fill(
                            child: Center(
                          child: Text(
                            'TOP' + (index + 1).toString(),
                            style: TextStyle(
                              color: ColorConfig.white,
                              fontSize: 10,
                            ),
                          ),
                        )),
                      ],
                    ),
                  )
                ],
              ),
            ),
            SizedBox(width: 10),
            Expanded(
                child: Column(
              mainAxisAlignment: MainAxisAlignment.start,
              crossAxisAlignment: CrossAxisAlignment.start,
              children: [
                Text(
                  item['Title'] ?? "",
                  style: TextStyle(
                    color: ColorConfig.text_label,
                    fontWeight: FontWeight.bold,
                    fontSize: 16.sp,
                  ),
                ),
                SizedBox(height: 10),
                Row(
                  children: [
                    Container(
                      padding:
                          EdgeInsets.symmetric(horizontal: 10, vertical: 5),
                      decoration: BoxDecoration(
                        gradient: LinearGradient(
                            begin: Alignment.centerLeft,
                            end: Alignment.centerRight,
                            colors: [
                              Color(0xFFE6F1FC),
                              Color(0xFFFFE4FE),
                            ]),
                        borderRadius: BorderRadius.circular(22),
                      ),
                      child: Center(
                        child: Text(
                          item['Selection'] ?? "",
                          style: TextStyle(
                            color: ColorConfig.text_label,
                            fontSize: 10,
                          ),
                        ),
                      ),
                    ),
                  ],
                ),
                SizedBox(height: 20),
                Text(
                  "项目：" + projectsStr,
                  style: TextStyle(
                    color: Color(0xFF959595),
                    fontSize: 10.sp,
                  ),
                ),
              ],
            ))
          ],
        ),
      ),
    );
  }

  Widget tuijianWidget() {
    return Container(
      decoration: BoxDecoration(
        color: ColorConfig.white,
        border: Border.all(color: Color(0xFFEDEDED)),
        borderRadius: BorderRadius.all(Radius.circular(10.r)),
      ),
      padding: EdgeInsets.symmetric(horizontal: 12, vertical: 26),
      child: Column(
        children: [
          aaaWidget(),
          SizedBox(height: 10),
          Container(
            clipBehavior: Clip.hardEdge,
            decoration: BoxDecoration(
              color: Colors.white,
              borderRadius: BorderRadius.all(Radius.circular(12.r)),
            ),
            child: Column(
              children: [
                imagesWidget(),
              ],
            ),
          )
        ],
      ),
    );
  }

  Widget imagesWidget() {
    return GridView.builder(
        physics: const NeverScrollableScrollPhysics(),
        shrinkWrap: true,
        itemCount: controller.citysList.length,
        gridDelegate: const SliverGridDelegateWithFixedCrossAxisCount(
            childAspectRatio: 1,
            crossAxisCount: 3,
            crossAxisSpacing: 10.0,
            mainAxisSpacing: 10.0),
        itemBuilder: (BuildContext context, int index) {
          Map item = controller.citysList[index];
          return InkWell(
            onTap: () {
              String full = box.read("full") ?? "";
              if (full.isNotEmpty) {
                showMang(full);
              } else {
                Get.toNamed(Routes.REMENJINGDIAN, arguments: item);
              }
            },
            child: Container(
              clipBehavior: Clip.hardEdge,
              decoration: BoxDecoration(
                borderRadius: BorderRadius.all(Radius.circular(10.r)),
              ),
              child: Stack(
                children: [
                  Positioned.fill(
                    child: Container(
                      clipBehavior: Clip.hardEdge,
                      decoration: BoxDecoration(
                        borderRadius: BorderRadius.all(Radius.circular(10.r)),
                      ),
                      child: LoadNetworkImageWidget(
                          fit: BoxFit.fill,
                          height: double.infinity,
                          imageUrl: item['PictureUrl'] ?? ""),
                    ),
                  ),
                  Positioned(
                    left: 0,
                    bottom: 0,
                    right: 0,
                    height: 40,
                    child: Container(
                      alignment: Alignment.center,
                      child: Text(
                        item['City'] ?? "",
                        style: TextStyle(
                            color: ColorConfig.white, fontSize: 12.sp),
                      ),
                    ),
                  )
                ],
              ),
            ),
          );
        });
  }

  Widget citysWidget() {
    return Container(
      child: GridView.builder(
          physics: const NeverScrollableScrollPhysics(),
          shrinkWrap: true,
          itemCount: 6,
          gridDelegate: const SliverGridDelegateWithFixedCrossAxisCount(
              childAspectRatio: 3.5,
              crossAxisCount: 3,
              crossAxisSpacing: 10.0,
              mainAxisSpacing: 10.0),
          itemBuilder: (BuildContext context, int index) {
            return InkWell(
              onTap: () {
                Get.toNamed(Routes.REMENJINGDIAN);
              },
              child: Container(
                clipBehavior: Clip.hardEdge,
                decoration: BoxDecoration(
                  color: Color(0xFFF7F7F7),
                  borderRadius: BorderRadius.all(Radius.circular(15)),
                ),
                alignment: Alignment.center,
                child: Text(
                  '成都',
                  style: TextStyle(color: ColorConfig.text_label, fontSize: 14),
                ),
              ),
            );
          }),
    );
  }

  Widget aaaWidget() {
    return Row(
      children: [
        Row(
          children: [
            Image.asset('assets/images/img@2x.png', width: 40),
            SizedBox(width: 5),
            Column(
              children: [
                Text(
                  '精选目的地',
                  style: TextStyle(
                      color: ColorConfig.text_label,
                      fontSize: 16.sp,
                      fontWeight: FontWeight.w600),
                ),
                SizedBox(height: 2),
                Text(
                  '一起去旅行吧！',
                  style:
                      TextStyle(color: ColorConfig.text_label, fontSize: 12.sp),
                ),
              ],
            ),
          ],
        ),
      ],
    );
  }

  Widget swiperWidget() {
    return Container(
      clipBehavior: Clip.hardEdge,
      decoration: BoxDecoration(
          // color: Colors.white,
          borderRadius: BorderRadius.all(Radius.circular(11))),
      width: 1.sw,
      child: AspectRatio(
          aspectRatio: (1.sw - 32) / ((1.sw - 32) * 130.5.h / (1.sw - 32)),
          child: Obx(() => Swiper(
              autoplay: true,
              loop: true,
              viewportFraction: 1,
              scale: 1,
              //自动轮播
              duration: 1000,
              key: ValueKey(controller.bannerList.length),
              itemBuilder: (c, i) {
                Map item = controller.bannerList[i];
                return InkWell(
                  onTap: () => {},
                  child: CachedNetworkImage(
                    imageUrl: item['PictureUrl'] ?? "",
                    fit: BoxFit.fill,
                  ),
                );
              },
              itemCount: controller.bannerList.length))),
    );
  }
}
